<!DOCTYPE html>
<meta charset="UTF-8">
<style>
    canvas {
        margin: 0 auto;
        border: 1px solid #aaa;
        display: block;
    }
</style>
<html>
    <canvas id="game" width="800px" height="500px"></canvas>
    <script src='./test.js'> </script>
    <script src='./ground.js'> </script>
    <script src='./sky.js'> </script>
    <script src='./player.js'> </script>
    <script src='./Skeleton1.js'> </script>
    <script src='./movePositions.js'> </script>
    <script src='./attackPositions.js'> </script>
    <script src='./player1.js'> </script>
    <script src='./main.js'> </script>
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function() {
            var canvas = document.querySelector('#game');
            var ctx = canvas.getContext('2d');
            // test(ctx);
            main(ctx, [ground, sky, player1]);
        });
    </script>
    

</html>
